<div class="issue-priority-solution-edit container-fluid">

  <div class="row">
    <div class="edit-toolbar col-xl-12">
      <div class="title">
        <span *ngIf="!model?.id">新建优先级方案</span>
        <span *ngIf="model?.id">编辑优先级方案</span>
      </div>
      <div class="buttons">
        <button (click)="back()" type="button"
                class="btn btn-secondary btn-with-icon btn-sm back">
          <i class="fa fa-arrow-circle-left"></i>返回
        </button>
      </div>
    </div>
  </div>
  <hr/>


  <form [formGroup]="form" class="my-validate-form">
    <div class="form-group row">
      <label class="col-sm-2 col-form-label"><span>名称</span></label>
      <div class="col-sm-10">
        <input type="text" class="form-control" name="name" formControlName="name"
               [(ngModel)]="model.name" #name>
      </div>
    </div>
    <div class="form-group row just-label">
      <label class="col-sm-1 col-form-label"><span>是否默认</span></label>
      <label class="col-sm-5 col-form-label left">
        {{model.defaultVal | trueOrFalse}}
      </label>

      <label class="col-sm-1 col-form-label"><span>是否內置</span></label>
      <label class="col-sm-5 col-form-label left">
        {{model.buildIn | trueOrFalse}}
      </label>
    </div>

    <div class="form-group row">
      <label class="col-sm-2 col-form-label"></label>
      <div class="col-sm-10">
        <button (click)="save()" type="button" class="btn btn-primary" [disabled]="!form.valid">保存</button>
        &nbsp;
        <button (click)="back()" type="button" class="btn btn-default">取消</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <button (click)="showModal()" *ngIf="model.id" type="button" class="btn btn-danger">删除</button>
      </div>
    </div>
  </form>

  <div class="form-group row">
    <label class="col-sm-2"></label>

    <div class="col-sm-5">
      <div class="checkbox-list">
        <div class="checkbox-list-inner">

          <div class="toolbar">
            <div class="toolbar-inner">
              <span class="title">可选问题优先级</span>
            </div>
          </div>
          <div><span (click)="addAll()" class="link">全部添加</span></div>

          <div>
            <div *ngFor="let item of otherItems" class="checkbox-list-item use-icon">
              <label (click)="addPriority(item)">
                <i class="fa fa-arrow-circle-right"></i>
                <span class="checkbox-name">{{item.label}}<span></span></span>
              </label>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="col-sm-5">
      <div class="checkbox-list">
        <div class="checkbox-list-inner">

          <div class="toolbar">
            <div class="toolbar-inner">
              <span class="title">已选问题优先级</span>
            </div>
          </div>
          <div><span (click)="removeAll()" class="link">全部移除</span></div>

          <div>
            <div *ngFor="let item of model.items" class="checkbox-list-item use-icon">
              <label (click)="removePriority(item)">
                <i class="fa fa-arrow-circle-left"></i>
                <span class="checkbox-name">{{item.label}}<span></span></span>
              </label>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="form-group row">
    <label class="col-sm-2 col-form-label"></label>
    <div class="col-sm-10">
      <div class="validate-errors">
        <div class="validate-error" *ngFor="let msg of formErrors">
          <div>{{ msg }}</div>
        </div>
      </div>
    </div>
  </div>

</div>

<pop-dialog #modalWrapper (confirm)="delete()" [title]="'提示'">
  确认删除名为"{{model.name}}"的优先级方案?
</pop-dialog>
